<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>、
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/1.6.8/axios.min.js"></script>
</head>
<body>
<button id="button_01">GET</button>
<button id="button_02">POST</button>
<button id="button_03">AJAX</button>
<script>
    // 配置 baseURL

    axios.defaults.baseURL = "http://localhost:8000"

    $("#button_01").click(() => {
        // GET 请求
        axios.get("/axios", {
            // 请求参数
            params: {
                a:100,
                b:200,
                c:300,
            },
        }).then(value => {
            console.log(value)
        })
    })

    $("#button_02").click(() => {
        // GET 请求
        axios.post  ("/axios", {
            // 请求参数
            params: {
                a:100,
                b:200,
                c:300,
            },

            // 请求体
            data: {
                username: "admin",
                password: "123123",
            }
        }).then(value => {
            console.log(value)
        })
    })

    $("#button_03").click(() => {
        axios({
            method: "GET",

            url: "/axios",

            params: {
                vip: 10,
                level: 30,
            },

            headers: {
                a: 100,
                b: 200,
            },

            data: {
                username: "admin",
                password: 123123,
            }
        })
    })

</script>
</body>
</html>